<!DOCTYPE html>
<html>
<head>
	<title></title>
	<meta charset="utf-8">
	<script type="text/javascript" src="http://cdn.bootcss.com/jquery/1.12.4/jquery.min.js"></script>
	<script type="text/javascript" src="/bower_components/bootstrap/dist/js/bootstrap.min.js"></script>
	<script type="text/javascript" src="/bower_components/upload-jquery/jquery.upload.js"></script>
	<link rel="stylesheet" type="text/css" href="/bower_components/bootstrap/dist/css/bootstrap.min.css">
	<link rel="stylesheet" type="text/css" href="/styles/admin.css">
</head>
<body id="add_bg">
	<div class="container">
		<div class="row">
			<div class="col-md-8 col-md-offset-2">
				<div class="page-header">
					<h1>添加新产品<a class="pull-right btn btn-info" href="/admin">返回产品列表</a></h1>
				</div>
				<form action="/admin/addProduct" method="post" target="fileUpload">
					<div class="form-group">
						<div class="row">
							<div class="col-xs-12">
								<label>产品选择</label>
							</div>
							<div class="col-xs-6">
								<select name="type_id" class="form-control" placeholder="请输入分类">
									<option value="$">---请选择分类---</option>
									<% for(var i=0;i<item.length;i++){ %>
										<option value="<%=item[i].id%>"><%=item[i].typename%></option>
									<% } %>
								</select>
							</div>
							<div class="col-xs-4 alert_top">
								<div class="alert alert2 alert-warning alert-dismissible" role="alert">
									<span class="error type_error"></span>
									<button type="button" class="close" data-dismiss="alert" aria-label="Close"><span aria-hidden="true">&times;</span></button>
								</div>
							</div>
						</div>
					</div>
					<div class="form-group">
						<div class="row">
							<div class="col-xs-12">
								<label>产品分类</label>
							</div>
							<div class="col-xs-6">
								<select name="cata_id" class="form-control" placeholder="请输入分类">
									<option value="$">---请选择分类---</option>
									<% for(var i=0;i<cata.length;i++){ %>
										<option value="<%=cata[i].id%>"><%=cata[i].name%></option>
									<% } %>
								</select>
							</div>
							<div class="col-xs-4 alert_top">
								<div class="alert alert4 alert-warning alert-dismissible" role="alert">
									<span class="error cata_error"></span>
									<button type="button" class="close" data-dismiss="alert" aria-label="Close"><span aria-hidden="true">&times;</span></button>
								</div>
							</div>
						</div>
					</div>
					<div class="form-group">
						<div class="row">
							<div class="col-xs-12">
								<label>产品价格</label>
							</div>
							<div class="col-xs-6">
								<input type="text" name="price" class="form-control title" placeholder="请输入产品价格">
							</div>
							<div class="col-xs-4 alert_top">
								<div class="alert alert1 alert-warning alert-dismissible" role="alert">
									<span class="error title_error"></span>
									<button type="button" class="close" data-dismiss="alert" aria-label="Close"><span aria-hidden="true">&times;</span></button>
								</div>
							</div>
						</div>
					</div>
					<div class="form-group">
						<div class="row">
							<div class="col-xs-12">
								<label>产品图片</label>
							</div>
							<div class="col-xs-4">
								<div class ="image_prev">
									<img id="image_prev">
								</div>
								<input id="image" class="form-control" type="hidden" name="images">
							</div>
							<div class="col-xs-4 alert_top image_error">
								<div class="alert alert3 alert-warning alert-dismissible" role="alert">
									<span class="error img_error"></span>
									<button type="button" class="close" data-dismiss="alert" aria-label="Close"><span aria-hidden="true">&times;</span></button>
								</div>
							</div>
							<div class="col-xs-8">
								<input class="btn btn-danger pull-left" type="button" onclick="doUpload()" value="上传">
							</div>
						</div>
					</div>
					<div class="form-group">
						<label>产品简介</label> <span class="error"></span>
						<textarea name="content" class="form-control"></textarea>
					</div>
					<button id="submit" type="submit" class="btn btn-primary">提交添加</button>
				</form>
			</div>
		</div>
	</div>
<script type="text/javascript">
	function doUpload(){
		// 上传方法
		$.upload({
			// 上传地址
			url: '/admin/upload', 
			// 文件域名字
			fileName: 'fileInput', 
			// 其他表单数据
			params: {},
			// 上传完成后, 返回json, text
			dataType: 'text',
			// 上传之前回调,return true表示可继续上传
			onSend: function() {
					return true;
			},
			// 上传之后回调
			onComplate: function(data) {
				$("#image").val(data);
				$("#image_prev").attr('src','/'+data);
			}
		});
	}
	$("#submit").click(function(){
		setTimeout(function(){
			$(".alert").css("transform","translate(0px,-34px)");
		},3000)
		setTimeout(function(){
			$(".alert").css("display","none");
			$(".alert").css("transform","translate(0px,0px)");
		},4000)
		$.post("addProduct",{
			type_id:$("select[name='type_id']").val(),
			cata_id:$("select[name='cata_id']").val(),
			price:$("input[name='price']").val(),
			images:$("input[name='images']").val(),
			content:$("[name='content']").val()
		},function(response,status){
			if (response=='分类未选择') {
				$(".alert2").css("display","block");
				$(".type_error").text(response);
			}
			if (response=='分类2未选择') {
				$(".alert4").css("display","block");
				$(".cata_error").text(response);
			}
			if (response=='请输入价格') {
				$(".alert1").css("display","block");
				$(".title_error").text(response);
			}
			if (response=='未上传图片') {
				$(".alert3").css("display","block");
				$(".img_error").text(response);
			}
			if (response=='内容不能为空') {
				alert(response);
			}
			if(response=='ok'){
				location.href="/admin"
			}
		})
		return false;
	})
</script>
</body>
</html>